<?xml version="1.0" encoding="UTF-8"?>

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:f="http://java.sun.com/jsf/core">
   
    <body>
        <ui:composition template="/common/templates/common.xhtml">
            <ui:param name="titulo" value="Crear Cliente" />
            <ui:define name="body">
                <a4j:form id="Cliente">
                    <rich:panel>
                        <rich:messages passedLabel="Data is allowed to be stored." layout="list">
                            <f:facet name="header">
                                <h:outputText value="Entered Data Status:"></h:outputText>
                            </f:facet>
                            <f:facet name="infoMarker">
                                <h:graphicImage  value="/img/passed_.gif" />
                            </f:facet>
                            <f:facet name="errorMarker">
                                <h:graphicImage value="/img/error_.gif" />
                            </f:facet>
                        </rich:messages>
                </rich:panel>

                    <h:panelGrid id="panelGridInsertar" columns="1">
                        <rich:panel id="panelInsertar" >
                            <f:facet name="header">
                                <h:outputText id="labelTitulo" value="Crear Cliente"/>
                             </f:facet>
                                <h:panelGrid id="pGridInput"  columns="2">
                                    <h:outputLabel id="tipoDocumento" value="(*) #{Messages['insert.cliente.tipoDocumento']}"/>
                                    <h:selectOneMenu value="#{ClienteBean.tipoDocumento}">
                                        <f:selectItems value = "#{ClienteBean.listaTiposDocumento}"/>
                                    </h:selectOneMenu>
                                    

                                    <h:outputLabel id="labelNumeroDoc" value="(*) #{Messages['insert.cliente.numeroDocumento']}"/>
                                    <h:inputText id="numeroDocumento" value="#{ClienteBean.numeroDocumento}" required="true">
                                        <rich:toolTip id="toolTipprodDescription" value="#{Messages['insert.cliente.numeroDocumento']}" style="padding:10px;" />
                                        <f:validateLength minimum="1" maximum="100"/>
                                        <rich:ajaxValidator event="onblur"/>
                                   </h:inputText>
                                   
                                    <h:outputLabel id="labelNombre" value="(*) #{Messages['insert.cliente.nombreCompleto']}"/>
                                    <h:inputText id="nombreCompleto" value="#{ClienteBean.nombreCompleto}" required="true">
                                        <rich:toolTip id="toolTipNombre" value="#{Messages['insert.cliente.nombreCompleto']}" style="padding:10px;" />
                                        <f:validateLength minimum="1" maximum="150"/>
                                        <rich:ajaxValidator event="onblur"/>
                                    </h:inputText >
                                    
                                    <h:outputLabel id="labelTelefono" value="(*) #{Messages['insert.cliente.telefono']}"/>
                                    <h:inputText id="telefono" value="#{ClienteBean.telefonoResidencia}" required="true">
                                        <rich:toolTip id="toolTipTelefono" value="#{Messages['insert.cliente.telefono']}" style="padding:10px;" />
                                        <f:validateLength minimum="1" maximum="150"/>
                                    </h:inputText >
                                    
                                    <h:outputLabel id="labelCelular" value="#{Messages['insert.cliente.celular']}"/>
                                    <h:inputText id="celular" value="#{ClienteBean.celular}">
                                        <rich:toolTip id="toolTipCelular" value="#{Messages['insert.cliente.celular']}" style="padding:10px;" />
                                    </h:inputText >
                                   
                                    <h:outputLabel id="labelDireccion" value="(*) #{Messages['insert.cliente.direccion']}"/>
                                    <h:inputText id="direccion" value="#{ClienteBean.direccion}" required="true">
                                        <rich:toolTip id="toolTipDireccion" value="#{Messages['insert.cliente.direccion']}" style="padding:10px;" />
                                        <f:validateLength minimum="1" maximum="100"/>
                                        <rich:ajaxValidator event="onblur"/>
                                    </h:inputText >
                                    
                                    <h:outputLabel id="pais" value="(*) #{Messages['insert.cliente.pais']}"/>
                                    <h:selectOneMenu value="#{ClienteBean.pais}">
                                        <f:selectItems value = "#{ClienteBean.listaPaises}"/>
                                     </h:selectOneMenu>

                                     <h:outputLabel id="departamento" value="(*) #{Messages['insert.cliente.departamento']}"/>
                                     <h:selectOneMenu value="#{ClienteBean.departamento}">
                                         <f:selectItems value = "#{ClienteBean.listaDepartamento}"/>
                                     </h:selectOneMenu>

                                     <h:outputLabel id="ciudades" value="(*) #{Messages['insert.cliente.ciudad']}"/>
                                     <h:selectOneMenu value="#{ClienteBean.ciudadResidencia}">
                                         <f:selectItems value = "#{ClienteBean.listaCiudades}"/>
                                     </h:selectOneMenu>
                                    

                                    <h:outputLabel id="labelProfesion" value="#{Messages['insert.cliente.profesion']}"/>
                                    <h:inputText id="profesion" value="#{ClienteBean.profesion}">
                                        <rich:toolTip id="toolTipProfesion" value="#{Messages['insert.cliente.profesion']}" style="padding:10px;" />
                                    </h:inputText >
                                    

                                    <h:outputLabel id="labelEmail" value="(*) #{Messages['insert.cliente.email']}"/>
                                    <h:inputText id="email" value="#{ClienteBean.email}" required="true">
                                        <rich:toolTip id="toolTipEmail" value="#{Messages['insert.cliente.email']}" style="padding:10px;" />
                                        <f:validateLength minimum="1" maximum="150"/>
                                        <rich:ajaxValidator event="onblur"/>
                                    </h:inputText >
                                                                        
                                </h:panelGrid>
                           
                         </rich:panel>
                     </h:panelGrid>
                     <h:panelGrid id="panelGridButton" columns="3">
                         <h:commandButton id="btnCrear" value="#{Messages['insert.cliente.crear']}" action="#{ClienteBean.crear}"/>
                        <h:outputText id="space" value="" escape="false"/>
                        <h:commandButton id="btnCancelar" value="#{Messages['common.cancel']}" action="#{ClienteBean.cancelar}" immediate="true" />
                    </h:panelGrid>
                </a4j:form>
             </ui:define>
        </ui:composition>
    </body>
</html>
